<!--
 * @Author: 'Chenfarry' '2925102113@qq.com'
 * @Date: 2024-07-19 11:45:07
 * @LastEditors: chenhuanhuan 2925102113@qq.com
 * @LastEditTime: 2024-09-03 12:03:03
 * @FilePath: \orderingApp\src\components\cu-card\cu-card.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <view class="box-border" :style="[newStyle]" @click="onClick">
    <slot></slot>
  </view>
</template>

<script lang="ts" setup>
import { computed } from 'vue'

const props = defineProps({
  padding: {
    type: String,
    default: '31rpx',
  },
  radius: {
    type: String,
    default: '16rpx',
  },
  color: {
    type: String,
    default: '#fff',
  },
  width: {
    type: String,
    default: 'auto',
  },
  height: {
    type: String,
    default: 'auto',
  },
  opticy: {
    type: Number,
    default: 1,
  },
  margin: {
    type: String,
    default: '0',
  },
  overflow: {
    type: String,
    default: 'auto',
  },
})

const emits = defineEmits<(e: 'click') => void>()

const newStyle = computed(() => {
  return `width:${props.width};height:${props.height};background:${props.color};padding:${props.padding};border-radius:${props.radius};opticy:${props.opticy};margin:${props.margin};overflow:${props.overflow}`
})

const onClick = (e) => {
  // emits('update:modelValue',e)
  emits('click')
}
</script>

<style lang="scss" scoped></style>
